


let BaseAnimView = require('./baseAnimView');

const templateDiv = `
     <label>相对位移</label><br/>
    <label>目标位置</label>
    x:<input class="dx mini_input" type="number" step="1">
    y:<input class="dy mini_input" type="number" step="1"> <br/>
    <label>时间</label>
    <input class="time mini_input" type="number" step="0.02" min="0.02"><br/>
    <button class="btnPlay">播放</button>
    <button class="btnStop">停止</button>
    <button class="btnDelete">删除</button>
    <label class="info"></label>
`;

let doubleBind = require('../../doubleBind');
// let settings = require('./../../settings');
let animUtils = require('./animUtils');

class MoveByView extends  BaseAnimView{
    constructor(){
        super(templateDiv);
    }

    bindModel(){
        let self = this;
        let lst = [];
        lst.push({
            el:this.rootEl.querySelector('.dx'),
            name:'dx',
            domName:'input',
            bNumber:true,
            callback:function () {
                let model = editor.getInspectView().getModel();
                if(model.anims){
                    model.anims.dx = self.model.dx;
                }
            }
        });
        lst.push({
            el:this.rootEl.querySelector('.dy'),
            name:'dy',
            domName:'input',
            bNumber:true,
            callback:function () {
                let model = editor.getInspectView().getModel();
                if(model.anims){
                    model.anims.dy = self.model.dy;
                }
            }
        });
        lst.push({
            el:this.rootEl.querySelector('.time'),
            name:'time',
            domName:'input',
            bNumber:true,
            callback:function () {
                let model = editor.getInspectView().getModel();
                if(model.anims){
                    model.anims.time = self.model.time;
                }
            }
        });

        this.model = {};
        lst.forEach(item=>{
            doubleBind(this.model,item);
        });
    }

    reset(){
        /**
         * 表示 动画 rotateBy 角度30 会耗费 1s
         * 那么 整个动画过程就是:
         *  RepectForever(Sequence(A->B->A)
         *  其中 A->B 的时间就是 1s
         *
         */
        this.model.dx = 20;
        this.model.dy = 20;
        this.model.time = 1;
    }

    _playAnim(selectSp){

        let inspAnimView = editor.getInspAnimView();
        inspAnimView.saveInitData();

        // 1. 删除之前的
        // editor.gameApp.actionMgr.removeAllActionOnTarget(selectSp);
        let actionMgr = cc.director.getActionManager();
        actionMgr.removeActionByTag(G.Tags.DecoBaseAction,selectSp.node);

        // 2. 创建动画,并进行播放
        let time = this.model.time;
        let dx = this.model.dx;
        let dy = this.model.dy;
        // let m1 = dd.moveBy(time,dx,dy);
        // let m2 = dd.moveBy(2 * time,-dx * 2,-dy * 2);
        // let m3 = dd.moveBy(time,dx,dy);
        // let seq = dd.sequence(m1,m2,m3);
        // let forever = dd.repeatForever(seq);

        let forever = animUtils.makeMoveBy(time,dx,dy);
        selectSp.node.runAction(forever);

        this.updateInfoLabel();
    }

    // updateInfoLabel(){
    //     let selectSp = editor.getInspectView().getSelectedSp();
    //     if(selectSp){
    //         let actionMgr = cc.director.getActionManager();
    //         let action =  actionMgr.getActionByTag(G.Tags.DecoBaseAction,selectSp.node);
    //         if(action){
    //             this.lbInfo.textContent = '动画中.....';
    //             this.lbInfo.style.color = 'red';
    //             return;
    //         }
    //     }
    //
    //     this.lbInfo.textContent = '停止';
    //     this.lbInfo.style.color = 'black';
    // }
}

module.exports = MoveByView;
